status: Put arrow icons next to the separate status indicators

This is to indicate that it has a pulldown menu.

This is a part of the new system status design, see
https://wiki.gnome.org/GnomeShell/Design/Guidelines/SystemStatus/
for design details.

https://bugzilla.gnome.org/show_bug.cgi?id=705845

diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 84768b12e916bc4ac89acea7b3035b3fc82009d9..46b5a75bb40238480840bd6547738ae504585c30 100644 (file)
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -614,7 +614,8 @@ StScrollBar StButton#vhandle:active {
     -boxpointer-gap: 4px;
 }
 
-.panel-status-button-box {
+.panel-status-button-box,
+.panel-status-menu-box {
     spacing: 4px;
 }
 

diff --git a/js/ui/panel.js b/js/ui/panel.js
index 27456f718b9c768a5a757f51051c055a0f225d58..342de77efb86c75459fd9fcd0dab9ebc56de67dd 100644 (file)
--- a/js/ui/panel.js
+++ b/js/ui/panel.js
@@ -208,12 +208,14 @@ const AppMenuButton = new Lang.Class({
                               Lang.bind(this, this._updateIconBoxClip));
         this._container.add_actor(this._iconBox);
 
-        this._hbox = new St.BoxLayout();
+        this._hbox = new St.BoxLayout({ style_class: 'panel-status-menu-box' });
         this._container.add_actor(this._hbox);
 
         this._label = new TextShadower();
         this._label.actor.y_align = Clutter.ActorAlign.CENTER;
         this._hbox.add_actor(this._label.actor);
+        this._arrow = new St.Label({ text: '\u25BE' });
+        this._hbox.add_actor(this._arrow);
 
         this._iconBottomClip = 0;
 
@@ -500,6 +502,7 @@ const AppMenuButton = new Lang.Class({
         if (this._iconBox.child != null)
             this._iconBox.child.destroy();
         this._iconBox.hide();
+        this._arrow.hide();
         this._label.setText('');
 
         if (this._appMenuNotifyId)
@@ -519,6 +522,7 @@ const AppMenuButton = new Lang.Class({
         this.setName(targetApp.get_name());
 
         this._syncIcon();
+        this._arrow.show();
         this._iconBox.show();
 
         if (targetApp.get_state() == Shell.AppState.STARTING ||

diff --git a/js/ui/status/accessibility.js b/js/ui/status/accessibility.js
index e6be115c8f3062bc0afe1ad4649ae58b435f0095..149c84aae47e7ef0458164794623c0a9ae00cf98 100644 (file)
--- a/js/ui/status/accessibility.js
+++ b/js/ui/status/accessibility.js
@@ -3,6 +3,7 @@
 const Gio = imports.gi.Gio;
 const Lang = imports.lang;
 const Mainloop = imports.mainloop;
+const St = imports.gi.St;
 
 const PanelMenu = imports.ui.panelMenu;
 const PopupMenu = imports.ui.popupMenu;
@@ -30,10 +31,17 @@ const HIGH_CONTRAST_THEME = 'HighContrast';
 
 const ATIndicator = new Lang.Class({
     Name: 'ATIndicator',
-    Extends: PanelMenu.SystemStatusButton,
+    Extends: PanelMenu.Button,
 
     _init: function() {
-        this.parent('preferences-desktop-accessibility-symbolic', _("Accessibility"));
+        this.parent(0.0, _("Accessibility"));
+
+        this._hbox = new St.BoxLayout({ style_class: 'panel-status-menu-box' });
+        this._hbox.add_child(new St.Icon({ style_class: 'system-status-icon',
+                                           icon_name: 'preferences-desktop-accessibility-symbolic' }));
+        this._hbox.add_child(new St.Label({ text: '\u25BE' }));
+
+        this.actor.add_child(this._hbox);
 
         let highContrast = this._buildHCItem();
         this.menu.addMenuItem(highContrast);

diff --git a/js/ui/status/keyboard.js b/js/ui/status/keyboard.js
index 397df8a8c5a06f0fee254f1c04607df7b55bc332..ea365c4c04dd75c7d0f4c5bf354f7a64726a294e 100644 (file)
--- a/js/ui/status/keyboard.js
+++ b/js/ui/status/keyboard.js
@@ -337,7 +337,12 @@ const InputSourceIndicator = new Lang.Class({
         this._container.connect('get-preferred-width', Lang.bind(this, this._containerGetPreferredWidth));
         this._container.connect('get-preferred-height', Lang.bind(this, this._containerGetPreferredHeight));
         this._container.connect('allocate', Lang.bind(this, this._containerAllocate));
-        this.actor.add_actor(this._container);
+
+        this._hbox = new St.BoxLayout({ style_class: 'panel-status-menu-box' });
+        this._hbox.add_child(this._container);
+        this._hbox.add_child(new St.Label({ text: '\u25BE' }));
+
+        this.actor.add(this._hbox, { y_expand: true });
         this.actor.add_style_class_name('panel-status-button');
 
         // All valid input sources currently in the gsettings